<div class="vc-group {{actived ? 'vc-actived' : ''}}">
  <dl class="vc-table-row vc-group-preview" data-reqid="{{id}}">
    <dd class="vc-table-col vc-table-col-4">{{name}}</dd>
    <dd class="vc-table-col">{{method}}</dd>
    <dd class="vc-table-col">{{status}}</dd>
    <dd class="vc-table-col">{{costTime}}</dd>
  </dl>
  <div class="vc-group-detail">
    <div>
      <dl class="vc-table-row vc-left-border">
        <dt class="vc-table-col vc-table-col-title">General</dt>
      </dl>
      <div class="vc-table-row vc-left-border vc-small">
        <div class="vc-table-col vc-table-col-2">URL</div>
        <div class="vc-table-col vc-table-col-4 vc-max-height-line">{{url}}</div>
      </div>
      <div class="vc-table-row vc-left-border vc-small">
        <div class="vc-table-col vc-table-col-2">Method</div>
        <div class="vc-table-col vc-table-col-4 vc-max-height-line">{{method}}</div>
      </div>
    </div>
    {{if (header !== null)}}
    <div>
      <dl class="vc-table-row vc-left-border">
        <dt class="vc-table-col vc-table-col-title">Response Headers</dt>
      </dl>
      {{for (var key in header)}}
      <div class="vc-table-row vc-left-border vc-small">
        <div class="vc-table-col vc-table-col-2">{{key}}</div>
        <div class="vc-table-col vc-table-col-4 vc-max-height-line">{{header[key]}}</div>
      </div>
      {{/for}}
    </div>
    {{/if}}
    {{if (requestHeader !== null)}}
    <div>
      <dl class="vc-table-row vc-left-border">
        <dt class="vc-table-col vc-table-col-title">Request Headers</dt>
      </dl>
      {{for (var key in requestHeader)}}
      <div class="vc-table-row vc-left-border vc-small">
        <div class="vc-table-col vc-table-col-2">{{key}}</div>
        <div class="vc-table-col vc-table-col-4 vc-max-height-line">{{requestHeader[key]}}</div>
      </div>
      {{/for}}
    </div>
    {{/if}}
    {{if (getData !== null)}}
    <div>
      <dl class="vc-table-row vc-left-border">
        <dt class="vc-table-col vc-table-col-title">Query String Parameters</dt>
      </dl>
      {{for (var key in getData)}}
      <div class="vc-table-row vc-left-border vc-small">
        <div class="vc-table-col vc-table-col-2">{{key}}</div>
        <div class="vc-table-col vc-table-col-4 vc-max-height-line">{{getData[key]}}</div>
      </div>
      {{/for}}
    </div>
    {{/if}}
    {{if (postData !== null)}}
    <div>
      <dl class="vc-table-row vc-left-border">
        <dt class="vc-table-col vc-table-col-title">Request Payload</dt>
      </dl>
      {{if (typeof postData === 'string')}}
        <div class="vc-table-row vc-left-border vc-small">
          <pre class="vc-table-col">{{postData}}</pre>
        </div>
      {{else}}
        {{for (var key in postData)}}
        <div class="vc-table-row vc-left-border vc-small">
          <div class="vc-table-col vc-table-col-2">{{key}}</div>
          <div class="vc-table-col vc-table-col-4 vc-max-height-line">{{postData[key]}}</div>
        </div>
        {{/for}}
      {{/if}}
    </div>
    {{/if}}
    <div>
      <dl class="vc-table-row vc-left-border">
        <dt class="vc-table-col vc-table-col-title">Response</dt>
      </dl>
      <div class="vc-table-row vc-left-border vc-small">
        <pre class="vc-table-col vc-max-height vc-min-height">{{response || ''}}</pre>
      </div>
    </div>
  </div>
</div>